<template>
	<view>
		<view v-if="" class="reserveWrapper">
			<view v-for="(item,index) in detailObj" class="itemWrapper">
				<view class="left">
					{{item.title}}
				</view>
				<view class="right">
					{{item.value}}
				</view>
			</view>
			<view class="bottomBtnContainer">
				<view class="bottomBtnWrapper" @click="gotoCustomDetail">
					查看客户详情
				</view>
			</view>
		</view>
	</view>
</template>

<script>
    const api = require("@/static/js/api.js")
    const utils = require("@/static/js/utils.js")
    import {
        mapState,
        mapMutations,
        mapActions
    } from 'vuex';
    let that = null

    
	export default {
		data() {
			return {
				messageObj:{},
				detailObj:[],
			};
		},
        
        computed: {
            ...mapState({
                hasLogin: state => state.userInfo.hasLogin,
                isAuthPhone: state => state.userInfo.isAuthPhone,
                isAuthUserInfo: state => state.userInfo.isAuthUserInfo, 
                isSeller: state => state.userInfo.isSeller,
                sellerObj: state => state.userInfo.sellerObj,
                buyerObj: state => state.userInfo.buyerObj,
                shopInfo: state => state.userInfo.shopInfo,
            }),
        },
        
        onLoad(options) {
            that = this;
			this.messageObj = JSON.parse(decodeURIComponent(options.item))
			console.log("messageObj", this.messageObj )
			if (this.messageObj.type == "customer_reserve_result"){
				this.getNoteReserve()
			}
			
        },
        onShow() {
      
        },
        methods:{ 
            ...mapMutations(['setUserInfo', 'setLoginStatus', 'setUserId',"setOrigin"]),
            
            getNoteReserve() {
                let that = this
                api.getNoteReserve({
                    param: {
                        id: that.messageObj.contentId,
                    }
                }).then(res => {
                    console.log("getNoteReserve:",res)
                    if (res.success) {  
						that.detailObj = JSON.parse(res.data.reportData)
                    }
                })
            },
			gotoCustomDetail(){
				uni.navigateTo({
					url: "/pages/shop/customer/customerDetail?id=" + this.messageObj.createUser
				})
			}
        }
	}
</script>
<style>
	page{
		background-color: #f6f6f6;
	}
</style>
<style lang="scss">
	.reserveWrapper{
		width: 714rpx;
		margin-left: 18rpx;
		padding: 30rpx;
		border-radius: 30rpx;
		background-color: #fff;
		margin-top: 30rpx;
		.itemWrapper{
			display: flex;
			align-items: center;
			padding: 20rpx 40rpx;
			border-bottom: 1px solid #f3f3f3;
			.left{
				width: 180rpx;
				display: flex;
				align-items: center;
				font-size: 28rpx;
				height: 40rpx;
				line-height: 40rpx;
				color: #000;
				.icon{
					margin-left: 10rpx;
					height: 16rpx;
					width: 16rpx;
				}
			}
			.right{
				margin-left: 20rpx;
				width: 450rpx;
				font-size: 26rpx;
				color: #888;
			}
		}
	}

</style>
